<!--
 * @Descripttion: 生产工单
 * @LastEditors: xzh
 * @LastEditTime: 2023-09-19 20:24:36
-->
<template>
  <el-card>
    <DileTable ref="dileTableRef">
      <template #preColumn>
        <vxe-column
          field="status"
          :title="$t('page.productOrderManageArr.productOrderArr.status')"
          width="100"
        />
        <vxe-column
          :title="
            $t('page.productOrderManageArr.productOrderArr.orderPriority')
          "
          width="100"
        >
          <template #default="{ row }">
            <span v-if="!!row.orderPriority">
              {{
                $t(
                  `page.productOrderManageArr.productOrderArr.orderPriorityArr.${row.orderPriority}`
                )
              }}
            </span>
          </template>
        </vxe-column>
        <vxe-column
          :title="$t('page.productOrderManageArr.productOrderArr.process')"
        >
          <template #default="{ row }">
            <el-progress
              :text-inside="true"
              :stroke-width="15"
              :percentage="70"
            />
          </template>
        </vxe-column>
        <vxe-column
          field="code"
          :title="$t('page.productOrderManageArr.productOrderArr.code')"
        />
        <vxe-column :title="$t('page.systemManageArr.productArr.code')">
          <template #default="{ row }">
            <span>{{ row.relProduct.code }}</span>
          </template>
        </vxe-column>
        <vxe-column :title="$t('page.systemManageArr.productArr.name')">
          <template #default="{ row }">
            <span>{{ row.relProduct.name }}</span>
          </template>
        </vxe-column>
        <vxe-column
          :title="$t('page.systemManageArr.productArr.type')"
          width="100"
        >
          <template #default="{ row }">
            <span>{{ row.relProduct.type }}</span>
          </template>
        </vxe-column>
        <vxe-column
          field="taskNum"
          :title="$t('page.productOrderManageArr.productOrderArr.taskNum')"
          width="100"
        />
      </template>
    </DileTable>
    <!-- 生产工单表单 -->
    <ProductOrderForm ref="productOrderFromRef" @refresh="initTableData" />
  </el-card>
</template>

<script setup lang="ts">
import { ref, reactive, provide, onMounted } from "vue";
import type { propsParam_Inf } from "@/components/dile-table/index.type";
import type { object_Inf } from "@/utils/typings/index.type";
import { useI18n } from "vue-i18n";
import { ElNotification, ElMessageBox } from "element-plus";
import { productOrderModuleToolEnum } from "@/utils/typings/productOrderManage/index.type";
import DileTable from "@/components/dile-table/index.vue";
import ProductOrderForm from "./productOrder-form/index.vue";
import Dile_APi from "@/api";

/**
 * @Author: xzh
 * @Descripttion:i18n实例
 * @Param:
 */
let { t } = useI18n();

/**
 * @Author: xzh
 * @Descripttion: 生产工单表单实例
 * @Param:
 */
let productOrderFromRef = ref<any>(null);
/**
 * @Author: xzh
 * @Descripttion: 表格实例
 * @Param:
 */
let dileTableRef = ref<any>(null);

/**
 * @Author: xzh
 * @Descripttion:初始化加载
 * @Param:
 */
onMounted(() => {
  initTableData();
});
/**
 * @Author: xzh
 * @Descripttion:表格加载事件
 * @Param:
 */
let initTableData = async () => {
  try {
    propsParam.loading = true;
    Object.assign(propsParam, {
      tableData: [],
      loading: true,
    });
    let { keyWord, pagination } = dileTableRef.value?.getTableParam(),
      { page, rows } = pagination;
    //获取生产工单列表
    let { record: tableData, total } = await Dile_APi.getProductOrderList({
      keyWord,
      pagination: {
        pageIndex: page,
        pageSize: rows,
      },
    });
    Object.assign(propsParam, {
      tableData: tableData.map((row: object_Inf) => {
        return {
          ...row,
          relProduct: {},
        };
      }),
      tableRecords: total,
    });
  } finally {
    propsParam.loading = false;
  }
};
/**
 * @Author: xzh
 * @Descripttion:工具栏按钮点击事件
 * @Param:
 * @param {*} event
 */
let handleToolBtnClick = (event: object_Inf) => {
  let { code } = event,
    { rowChecked } = dileTableRef.value;
  //![新增]->行勾选判断
  if (!["add"].includes(code) && !rowChecked()) {
    return false;
  }
  switch (code) {
    case "add":
    case "edit":
      //加载生产工单抽屉
      InitProductOrderDrawer(code);
      break;
    case "delete":
      //删除
      handleDelete();
      break;
    case "enable":
    case "disEnable":
      //启用&&停用
      handleUpdateStatus(code);
      break;
  }
};

/**
 * @Author: xzh
 * @Descripttion:加载生产工单抽屉
 * @Param:
 * @param {*} code
 */
let InitProductOrderDrawer = (code: string) => {
  let { clearCheckboxRow, getTableParam } = dileTableRef.value,
    { selectObjArr } = getTableParam(),
    currentRow = selectObjArr?.find(() => true);
  //加载抽屉
  productOrderFromRef.value.init(code == "edit" ? currentRow.id : 0);
  //清楚行选中
  code == "edit" && clearCheckboxRow([currentRow]);
};

/**
 * @Author: xzh
 * @Descripttion: 修改状态
 * @Param:
 * @param {*} code
 */
let handleUpdateStatus = async (code: string) => {
  try {
    propsParam.loading = true;
    let { selectObjArr } = dileTableRef.value.getTableParam(),
      ids: Array<string> = selectObjArr.map((x: object_Inf) => x.id),
      //修改状态
      updateSatus = code == "enable";
    //更新生产工单
    await Dile_APi.updateProductOrderStatus(ids, updateSatus);
    //提示成功
    ElNotification({
      message: t("common.message.OperationSuccess"),
      type: "success",
    });
    //修改行状态
    (propsParam.tableData || [])
      .filter((x) => ids.includes(x.id))
      .forEach((row) => (row.status = updateSatus));
  } finally {
    propsParam.loading = false;
  }
};

/**
 * @Author: xzh
 * @Descripttion: 删除事件
 * @Param:
 */
let handleDelete = () => {
  ElMessageBox.confirm(
    t("common.message.deleteVerify"),
    t("common.message.confirmInfo"),
    {
      distinguishCancelAndClose: true,
      type: "warning",
      confirmButtonText: t("common.define"),
      cancelButtonText: t("common.cancel"),
    }
  ).then(async () => {
    try {
      propsParam.loading = true;
      let { selectObjArr }: object_Inf = dileTableRef.value.getTableParam();
      //删除选中生产工单
      await Dile_APi.deleteProductOrder(
        selectObjArr.map((x: object_Inf) => x.id)
      );
      //提示成功
      ElNotification({
        message: t("common.message.OperationSuccess"),
        type: "success",
      });
      //刷新表格
      initTableData();
    } finally {
      propsParam.loading = false;
    }
  });
};
/**
 * @Author: xzh
 * @Descripttion: 表格参数
 * @Param:
 */
let propsParam = reactive<propsParam_Inf>({
  moduleToolCode: productOrderModuleToolEnum.productOrder,
  loading: false,
  checkbox: true,
  tableData: [],
  isPagination: true,
  emitEvents: {
    refreshTable: initTableData,
    toolBtnClick: handleToolBtnClick,
  },
});
provide("propsParam", propsParam);
</script>
<style lang="scss" scoped></style>
